<#-- @ftlvariable name="entity" type="com.xci.edu.core.entity.EduCoursewareDetails" -->
<#include "/sys/_layout.ftl">
<!doctype html>
<html>
<head>
    <@pageHeader/>
</head>
<body>
<@pageLoading/>
<div class="jxpanel winpanel" data-fit="true">
    <form id="editform" class="jxform" method="post"
          action="${saveUrl("/background/eduCoursewareDetails/","createSave","updateSave")}">
        <input name="id" value="${entity.id}" type="hidden">
        <table class="table jxtable-form">
            <#--            <tr>-->
            <#--                <th class="w-100px">课程主键</th>-->
            <#--                <td>-->
            <#--                    <input class="form-control" id="coursewareId" name="coursewareId" value="${entity.coursewareId}" maxlength="" data-validate="required: [true,'请输入课程主键']" autocomplete="off"/>-->
            <#--                </td>-->
            <#--            </tr>-->
            <#--            <tr>-->
            <#--                <th>课件名称</th>-->
            <#--                <td>-->
            <#--                    <input class="form-control" id="name" name="name" value="${entity.name}" maxlength="50" data-validate="required: [true,'请输入课件名称']" autocomplete="off"/>-->
            <#--                </td>-->
            <#--            </tr>-->
            <tr>

            </tr>
            <tr>
                <th>课件地址</th>
                <td>
                    <div class="box">
                        <p class="fileBox">存放图片的位置</p>
                        <input type="file" id="file" class="input-group file-caption-main">
                    </div>
                    <textarea id="htmlContent" name="htmlContent"
                              class="form-control jxhtmleditor">${entity.htmlContent}</textarea>
                </td>

                <#--                <td>-->
                <#--                    <input class="form-control" id="url" name="url" value="${entity.url}" maxlength="500" data-validate="required: [true,'请输入课件地址']" autocomplete="off"/>-->
                <#--                    <input type="file" id="photo" name="photo">-->
                <#--                    <textarea id="htmlContent" name="htmlContent" class="form-control jxhtmleditor">${entity.htmlContent}</textarea>-->
                <#--                </td>-->
                <#--                <td colspan="3">-->
                <#--                    <textarea id="htmlContent" name="htmlContent" class="form-control jxhtmleditor">${entity.htmlContent}</textarea>-->
                <#--                </td>-->
            </tr>

            <tr>
                <th>排序号</th>
                <td>
                    <input class="form-control" id="path" name="path" value="${entity.path}" maxlength=""
                           data-validate="required: [true,'请输入排序号']" autocomplete="off"/>
                </td>
            </tr>
        </table>
    </form>
    <div class="panel-footer text-right">
        <@editFormDialogCommand/>
    </div>
</div>
<@editFormPageFooter/>
<script>
    $(".inputCon").change(function () {
        let file = document.getElementById('file').files[0];
        let fr = new FileReader();
        fr.readAsDataURL(file);  //将文件读取为tata Url
        fr.onload = function (e) {
            let result = e.target.result;
            // 图片上传
            if (/image/g.test(file.type)) {
                let img = $('<img src="' + result + '">');
                $(".fileBox").html("").append(img);
            }
            // 视频上传
            else if (/video/g.test(file.type)) {
                let video = $('<video  controls src="' + result + '">');
                $(".fileBox").html("").append(video);
            }
        }
    });
    <#--$('#htmlContent').options({-->
    <#--    height: 400,-->
    <#--    uploadJson: '<@kindeditorUploadUrl/>',-->
    <#--    fileManagerJson: '<@kindeditorFileManagerUrl/>'-->
    <#--});-->
</script>

</body>
</html>
